What is a semantic element?
What is a Semantic Element
A semantic element in HTML is an element that clearly describes its meaning to both the browser and the developer. Unlike non-semantic elements (like <div> or <span>), semantic elements tell you what kind of content they contain and what role they play in the structure of the page.
- 1
They provide meaning to the content (e.g., <header> is for introductory content, <footer> for closing content).
- 2
They improve accessibility because assistive technologies can identify the purpose of the content.
- 3
They help search engines better understand the structure of a page, improving SEO.
- 4
They make the code easier to read and maintain for developers.
- 5
Examples include: <header>, <footer>, <article>, <section>, <nav>, <aside>, <main>, <figure>, <figcaption>.
In short: Semantic elements add meaning to your HTML. They describe what the content is, not just how it looks.